<template>
  <div class="page-container">
    <div class="content-wrapper">
      <div class="policy-header">
        <h1>免责声明</h1>
        <button class="back-button" @click="goBack">关闭</button>
      </div>
      <div class="disclaimer-content">
        <section>
          <h2>1. 信息性质说明</h2>
          <p>健康预测系统（以下简称"本系统"）提供的所有信息、数据、分析结果和建议仅供参考，不构成医疗诊断、治疗建议或医疗咨询。本系统不提供医疗服务，也不替代专业医疗机构或医疗人员的诊断和治疗。</p>
        </section>
        
        <section>
          <h2>2. 健康信息使用提示</h2>
          <p>本系统基于用户提供的数据和预设算法生成健康预测和分析结果。由于健康状况的复杂性和个体差异，这些预测和分析可能存在局限性，不能完全准确地反映用户的实际健康状况。</p>
          <p>您在使用本系统提供的任何信息或建议之前，应当：</p>
          <ul>
            <li>咨询有资质的医疗专业人员，获取专业医疗建议</li>
            <li>不应仅凭本系统的信息做出医疗决策</li>
            <li>理解健康预测不等于医疗诊断</li>
          </ul>
        </section>
        
        <section>
          <h2>3. 责任限制</h2>
          <p>在法律允许的最大范围内，本系统及其运营方不对因使用或依赖本系统提供的信息而导致的任何损失、损害或后果承担责任，包括但不限于：</p>
          <ul>
            <li>因健康预测不准确或错误导致的任何直接或间接损失</li>
            <li>因用户根据系统建议采取或未采取行动而导致的健康问题</li>
            <li>因系统故障、中断或数据丢失导致的任何损失</li>
            <li>因用户输入不准确或不完整数据导致的任何后果</li>
          </ul>
          <p>本系统不对用户的健康状况或任何健康相关决策承担责任。健康相关问题的诊断和治疗应当由具备相应资质的医疗专业人员进行。</p>
        </section>
        
        <section>
          <h2>4. 数据准确性与完整性</h2>
          <p>虽然我们努力确保系统数据的准确性和完整性，但我们不对数据的绝对准确性、完整性或时效性做出保证。系统中的信息可能会随着医学研究和实践的发展而更新，因此可能包含过时的内容。</p>
          <p>用户应当对其输入到系统中的数据负责，确保数据的准确性和完整性。我们不对因用户提供的信息不准确或不完整而导致的任何后果负责。</p>
        </section>
        
        <section>
          <h2>5. 系统可用性</h2>
          <p>我们尽最大努力确保系统的稳定运行和可用性，但不对系统的持续可用、无错误或无中断做出保证。系统可能会因维护、升级、网络问题或其他不可预见的原因而暂时无法访问或功能受限。</p>
          <p>我们不对因系统不可用或功能受限而导致的任何损失或不便承担责任。</p>
        </section>
        
        <section>
          <h2>6. 第三方内容</h2>
          <p>本系统可能包含指向第三方网站或服务的链接，或者整合第三方提供的内容。这些第三方内容不在我们的控制范围内，我们不对其准确性、完整性、及时性、合法性或适用性负责。</p>
          <p>包含这些链接或内容不构成我们对第三方或其产品、服务的认可或推荐。您应当自行评估和承担使用第三方内容的风险。</p>
        </section>
        
        <section>
          <h2>7. 未成年人使用</h2>
          <p>本系统不面向未满18周岁的未成年人。如果您是未成年人，请在父母或监护人的指导下使用本系统，并确保获取适当的医疗建议。</p>
        </section>
        
        <section>
          <h2>8. 专业人士使用提示</h2>
          <p>即使对于医疗专业人员，本系统也不应替代专业判断。医疗专业人员在使用本系统辅助决策时，应当结合自己的专业知识、临床经验和其他相关信息进行综合判断。</p>
        </section>
        
        <section>
          <h2>9. 紧急情况说明</h2>
          <p>本系统不提供紧急医疗服务。如果您或他人遇到医疗紧急情况，请立即拨打当地的紧急救援电话（如120）或前往最近的急诊室就医。</p>
        </section>
        
        <section>
          <h2>10. 免责声明的变更</h2>
          <p>我们可能会不时更新本免责声明。当我们进行重大更改时，我们会在系统中发布通知，并更新页面顶部的"最后更新日期"。您继续使用本系统将被视为接受更新后的免责声明。</p>
        </section>
        
        <section>
          <h2>11. 适用法律</h2>
          <p>本免责声明受中华人民共和国法律管辖。如您对本免责声明有任何疑问，请联系我们。</p>
        </section>
        
        <section>
          <h2>12. 联系我们</h2>
          <p>如果您对本免责声明有任何问题或意见，请通过以下方式联系我们：</p>
          <p>电子邮件：disclaimer@healthpredict.com</p>
          <p>电话：400-123-4567</p>
        </section>
        
        <div class="last-updated">最后更新日期：2025年10月24日</div>
      </div>
    </div>
  </div>
</template>

<script setup>
// 免责声明页面组件
import { useRouter } from 'vue-router'

const router = useRouter()

function goBack() {
  router.back()
}
</script>

<style scoped>
.page-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px;
  min-height: 100vh;
  background-color: #f5f7fa;
}

.content-wrapper {
  background-color: #fff;
  padding: 40px;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  position: relative;
}

.policy-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30px;
  padding-bottom: 20px;
  border-bottom: 2px solid #ecf0f1;
}

h1 {
  color: #2c3e50;
  margin: 0;
  font-size: 28px;
}

.back-button {
  background-color: #3498db;
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 16px;
  transition: background-color 0.3s ease;
}

.back-button:hover {
  background-color: #2980b9;
}

/* 确保正确的内容区域类名 */
.disclaimer-content {
  max-height: 60vh;
  overflow-y: auto;
  padding-right: 10px;
  background-color: #ffffff;
  padding: 2rem;
}

section {
  margin-bottom: 2.5rem;
}

h2 {
  color: #3498db;
  margin-top: 30px;
  margin-bottom: 15px;
  border-bottom: 2px solid #ecf0f1;
  padding-bottom: 10px;
  font-size: 22px;
}

p {
  color: #34495e;
  line-height: 1.8;
  margin-bottom: 15px;
  text-align: justify;
}

ul {
  padding-left: 1.5rem;
  margin-bottom: 1.5rem;
}

li {
  color: #34495e;
  line-height: 1.8;
  margin-bottom: 8px;
}

.last-updated {
  text-align: center;
  color: #94a3b8;
  font-size: 0.875rem;
  margin-top: 3rem;
  padding-top: 1rem;
  border-top: 1px solid #e2e8f0;
}

/* 滚动条样式 */
.disclaimer-content::-webkit-scrollbar {
  width: 8px;
}

.disclaimer-content::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 4px;
}

.disclaimer-content::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 4px;
}

.disclaimer-content::-webkit-scrollbar-thumb:hover {
  background: #555;
}

@media (max-width: 768px) {
  .disclaimer-content {
    padding: 1.5rem;
  }
  
  h2 {
    font-size: 1.35rem;
  }
}
</style>